<!DOCUMENT>
<html>
	<head>
		<title>chat demo</title>
		<script type="text/javascript">
		function addchatter() {
			var div = document.createElement('div');
			div.className = 'chatter';
			var ifr = document.createElement('iframe');
			ifr.src = 'chat.html';
			div.appendChild(ifr);
			document.getElementById('main').appendChild(div);
		}	
		</script>
		<style type="text/css">
		.chatter {
			width: 28%;
			float: left;
			height: 13em;
			overflow: hidden;
			border: 1px solid red;
			margin-left: 1%;
			margin-bottom: 1em;
		}
		
		.chatter iframe {
			border: 0;
			width: 100%;
			height: 100%;	
		}
		</style>
	</head>
	<body>
		<div id="toolbar">
			<input type="button" value="add chat panel" onclick="addchatter()" />
		</div>
		<div id="main">
			
		</div>
		
	</body>
</html>